import React, { Component } from 'react';
import store from '../../store'
import actions from '../../store/actions'
class Index extends Component {
  static defaultProps = {
    isTitle: true
  }
  handleClick(v) {
    const action = actions.switchChecked(v)
    store.dispatch(action)
  }
  render() {
    const { list, isTitle } = this.props
    return (
      <div className="list">
        {
          list.length > 0 && list.map((v, i) => {
            return (
              <dl key={i} className={ v.isChecked ? 'active': '' }
                onClick={ () => this.handleClick(v) }
              >
                <dt>
                  <img src={v.url} alt="" />
                </dt>
                <dd style={{ display:  isTitle ? 'block' : 'none' }}>
                  <h3>{v.title}</h3>
                </dd>
              </dl>
            )
          })
        }
      </div>
    );
  }
}

export default Index;
